import React, { useState } from 'react';
import styles from './index.less';
import { Modal } from 'antd';
import moment from 'moment';
import { getDvaApp } from 'umi';
import TRNotification from '@/utils/notification';
import notice from '@/assets/programUpdate/notice.png';
import { CloseCircleOutlined } from '@/utils/antdIcons';
import { closeMessage } from '@/services/eam';
const NoticeMessageAlert = ({ title, typeTitle, content, startTime, endTime, onClose }) => {
  const [visible, setVisible] = useState(true);
  const handleCancel = async () => {
    setVisible(false);
    onClose?.();
    const userId = getDvaApp()?._store?.getState()?.user?.currentUser?.personId;
    await closeMessage({ userId });
  };

  return (
    <Modal
      visible={visible}
      footer={null}
      centered
      width={700}
      onCancel={handleCancel}
      wrapClassName={styles.NoticeMessageAlert}
      getContainer={false}
      closable={false}
    >
      <div className={styles.contentBox}>
        <CloseCircleOutlined className={styles.closable} onClick={handleCancel} />
        <div className={styles.title}>
          <img className={styles.img} src={notice} alt="" />
          {typeTitle ?? '系统升级公告'}
        </div>
        <div className={styles.content}>
          <div className={styles.titleNotice}>{title}</div>
          <div className={styles.contentNotice}>{content}</div>
          <div className={styles.contentTime}>
            <span>开始时间：{moment(startTime).format('YYYY-MM-DD HH:mm') || '-'}</span>
            <span>结束时间：{moment(endTime).format('YYYY-MM-DD HH:mm') || '-'}</span>
          </div>
        </div>
      </div>
    </Modal>
  );
};

class MessageAlert {
  __key__ = '';
  show = (param) => {
    if (this.__key__.length === 0) {
      this.__key__ = String(Date.now());
      TRNotification.add({
        key: this.__key__,
        content: (
          <NoticeMessageAlert
            {...param}
            onClose={() => {
              this.dismiss();
            }}
          />
        ),
        dismiss: this.dismiss,
      });
    }
  };
  dismiss = () => {
    if (this.__key__.length > 0) {
      TRNotification.remove(this.__key__);
      this.__key__ = '';
    }
  };
}
const feed = new MessageAlert();
export default feed;
